<template>
    <!-- <view class="user-info flex px-[50rpx] justify-between py-[50rpx]"> -->
	<view class="user-info flex justify-between">
        <view
            v-if="isLogin"
            class="flex items-center"
            @click="navigateTo('/pages/user_data/user_data')"
        >
            <u-avatar :src="user.avatar" :size="120"></u-avatar>
            <view class="text-white1 ml-[20rpx]">
                <view class="text-2xl">{{ user.nickname }}</view>
                <view class="text-xs mt-[18rpx]" @click.stop="copy(user.account)">
                    账号：{{ user.account }}
                </view>
            </view>
        </view>
        <navigator v-else class="flex items-center" hover-class="none" url="/pages/login/login">
            <u-avatar src="/static/images/user/default_avatar.png" :size="120"></u-avatar>
            <view class="text-white1 text-3xl ml-[20rpx]">未登录</view>
        </navigator>
      <!-- <navigator v-if="isLogin" hover-class="none" url="/pages/user_set/user_set">
            <u-icon name="setting" color="#252525" :size="48"></u-icon>
        </navigator> -->
		<view class="tuichu" v-if="isLogin"  @click="logoutHandle">
			退出登录
		</view>
    </view>
</template>
<script lang="ts" setup>
import { useCopy } from '@/hooks/useCopy'
import { useUserStore } from '@/stores/user'
import { computed, ref } from 'vue'
const userStore = useUserStore()
const userInfo = computed(() => userStore.userInfo)
const props = defineProps({
    content: {
        type: Object,
        default: () => ({})
    },
    styles: {
        type: Object,
        default: () => ({})
    },
    user: {
        type: Object,
        default: () => ({})
    },
    isLogin: {
        type: Boolean
    }
})
const { copy } = useCopy()
const navigateTo = (url: string) => {
    uni.navigateTo({
        url
    })
}

// 退出登录
const logoutHandle = () => {
    uni.showModal({
        content: '是否退出登录？',
        confirmColor: '#4173FF',
        success: ({ cancel }) => {
            if (cancel) return
            userStore.logout()
            uni.redirectTo({ url: '/pages/login/login' })
        }
    })
}
</script>

<style lang="scss" scoped>
// .user-info {
//     background: url(../../../static/images/user/my_topbg.png);
//     height: 230rpx;
//     background-position: bottom;
//     background-size: 100% auto;
// }
.user-info{
		position: absolute;
		top: 184rpx;
		left: 36rpx;
		
		
	}
	.text-white1{
		font-size: 40rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		color: #252525;
	}
	.tuichu{
		position: absolute;
		right: -300rpx;
		top: 30rpx;
	}
</style>
